.hero-service-card{
    right: 80PX;
    /* انتقال به سمت راست برج */
    margin-right: 0;
    margin-left: 10px;  /* فاصله از برج (۱۰px) */
  }
 

  .hero-logo img{
    width: 80.00006103515625px;
    height: 16.1419734954834px;
    opacity: 1;
    left: 24px;
  }

  .Header-Line{
    width: 145.00001560745773;
    opacity: 1;
    top: 41.99px;
    left: 10px;
    border-width: 1px;
    margin-left: 60px;
  }

  .hero-btn-start{
    width: 134px;
    height: 48px;
    opacity: 1;
    top: 264px;
    left: 24px;
    border-radius: 20px;
    padding-top: 12px;
    padding-right: 20px;
    padding-bottom: 12px;
    padding-left: 20px;
    gap: 8px;
    /*text*/
    font-family: Avenir;
    font-weight: 500;
    font-style: Medium;
    font-size: 14px;
    line-height: 100%;
    letter-spacing: 0px;
    text-align: center;
  }

  .hero-kicker{
    font-family: Avenir;
    font-weight: 400;
    font-style: Roman;
    font-size: 16px;
    color: rgba(255, 255, 255, 0.8);
    line-height: 100%;
    letter-spacing: 0px;
  }

  .hero-title{
    font-family: Avenir;
    font-weight: 900;
    font-style: Black;
    font-size: 36px !important;
    line-height: 100%;
    letter-spacing: 0px;
  }

  .hero-subtitle{ 
    max-width: 320px;
    font-family: Avenir;
    font-weight: 400;
    font-style: Roman;
    font-size: 18px;
    line-height:  2rem !important;
    letter-spacing:0px;
  }
  .hero-services-list{
  top: var(--services-top);
  right: var(--services-right);
  gap: 7px;
}
.hero-nav-pill {
    display: none !IMPORTANT;
     
}
.hero{
  /* اگر تصویر جدا برای تبلت داری اینو عوض کن */
  background-image: url("../../img/hero-bg-tablet.webp");
  background-position: top center;
   min-height: 750px;
 /* min-height:800px; /* ادامه منطقی از 575 */
}
/*------------------------------------- Start Default value-------------------------------------------------*/
.hero-service-icon:nth-child(1){ --icon-x: var(--icon1-x); }
.hero-service-icon:nth-child(2){ --icon-x: var(--icon2-x); }
.hero-service-icon:nth-child(3){ --icon-x: var(--icon3-x); }
.hero-service-icon:nth-child(4){ --icon-x: var(--icon4-x); }
.hero-service-icon:nth-child(5){ --icon-x: var(--icon5-x); }
.hero-service-icon:nth-child(6){ --icon-x: var(--icon6-x); }
.hero-service-icon:nth-child(7){ --icon-x: var(--icon7-x); }

:root{
     /* hero services positioning */
    --services-top: 250px;
    --services-right: 273px;

    /* icon horizontal offsets */
    --icon1-x: 45px;
    --icon2-x: 28px;
    --icon3-x:18px;
    --icon4-x: 5px;
    --icon5-x: -5px;
    --icon6-x: -10px;
    --icon7-x: -15px;
  }
     .hero-header{margin-bottom: 10px !important;}
 
/*=================== START: Tablet Standard | 768–991 ===================*/
/* Devices: iPad (portrait/landscape), iPad Air, اکثر تبلت‌های اندروید */

/*=================== START: Tablet Standard Step | 768–772 ===================*/
@media (min-width: 768px) and (max-width: 772.98px){
    :root{ --services-top: 260px; --services-right: 290px; }
}
/*=================== END: Tablet Standard Step | 768–772 ===================*/

/*=================== START: Tablet Standard Step | 773–777 ===================*/
@media (min-width: 773px) and (max-width: 777.98px){
  :root{ --services-top: 255px; --services-right: 280px; }
}
/*=================== END: Tablet Standard Step | 773–777 ===================*/

/*=================== START: Tablet Standard Step | 778–782 ===================*/
@media (min-width: 778px) and (max-width: 782.98px){
  :root{ --services-top: 255px; --services-right: 280px; }
}
/*=================== END: Tablet Standard Step | 778–782 ===================*/

/*=================== START: Tablet Standard Step | 783–787 ===================*/
@media (min-width: 783px) and (max-width: 787.98px){
  :root{ --services-top: 255px; --services-right: 280px; }
}
/*=================== END: Tablet Standard Step | 783–787 ===================*/

/*=================== START: Tablet Standard Step | 788–792 ===================*/
@media (min-width: 788px) and (max-width: 792.98px){
  :root{ --services-top: 260px; --services-right: 285px; }
}
/*=================== END: Tablet Standard Step | 788–792 ===================*/

/*=================== START: Tablet Standard Step | 793–797 ===================*/
@media (min-width: 793px) and (max-width: 797.98px){
  :root{ --services-top: 260px; --services-right: 280px; }
}
/*=================== END: Tablet Standard Step | 793–797 ===================*/

/*=================== START: Tablet Standard Step | 798–802 ===================*/
@media (min-width: 798px) and (max-width: 802.98px){
  :root{ --services-top: 260px; --services-right: 280px; }
}
/*=================== END: Tablet Standard Step | 798–802 ===================*/

/*=================== START: Tablet Standard Step | 803–807 ===================*/
@media (min-width: 803px) and (max-width: 807.98px){
  :root{ --services-top: 260px; --services-right: 280px; }
}
/*=================== END: Tablet Standard Step | 803–807 ===================*/

/*=================== START: Tablet Standard Step | 808–812 ===================*/
@media (min-width: 808px) and (max-width: 812.98px){
  :root{ --services-top: 260px; --services-right: 280px; }
}
/*=================== END: Tablet Standard Step | 808–812 ===================*/

/*=================== START: Tablet Standard Step | 813–817 ===================*/
@media (min-width: 813px) and (max-width: 817.98px){
  :root{ --services-top: 270px; --services-right: 280px; }
}
/*=================== END: Tablet Standard Step | 813–817 ===================*/

/*=================== START: Tablet Standard Step | 818–822 ===================*/
@media (min-width: 818px) and (max-width: 822.98px){
  :root{ --services-top: 269px; --services-right: 280px; }
}
/*=================== END: Tablet Standard Step | 818–822 ===================*/

/*=================== START: Tablet Standard Step | 823–827 ===================*/
@media (min-width: 823px) and (max-width: 827.98px){
  :root{ --services-top: 270px; --services-right: 280px; }
}
/*=================== END: Tablet Standard Step | 823–827 ===================*/

/*=================== START: Tablet Standard Step | 828–832 ===================*/
@media (min-width: 828px) and (max-width: 832.98px){
  :root{ --services-top: 270px; --services-right: 276px; }
}
/*=================== END: Tablet Standard Step | 828–832 ===================*/

/*=================== START: Tablet Standard Step | 833–837 ===================*/
@media (min-width: 833px) and (max-width: 837.98px){
  :root{ --services-top: 270px; --services-right: 280px; }
}
/*=================== END: Tablet Standard Step | 833–837 ===================*/

/*=================== START: Tablet Standard Step | 838–842 ===================*/
@media (min-width: 838px) and (max-width: 842.98px){
  :root{ --services-top: 275px; --services-right: 280px; }
}
/*=================== END: Tablet Standard Step | 838–842 ===================*/

/*=================== START: Tablet Standard Step | 843–847 ===================*/
@media (min-width: 843px) and (max-width: 847.98px){
  :root{ --services-top: 279px; --services-right: 270px; }
}
/*=================== END: Tablet Standard Step | 843–847 ===================*/

/*=================== START: Tablet Standard Step | 848–852 ===================*/
@media (min-width: 848px) and (max-width: 852.98px){
  :root{ --services-top: 280px; --services-right: 275px; }
}
/*=================== END: Tablet Standard Step | 848–852 ===================*/

/*=================== START: Tablet Standard Step | 853–857 ===================*/
@media (min-width: 853px) and (max-width: 857.98px){
  :root{ --services-top: 280px; --services-right: 270px; }
}
/*=================== END: Tablet Standard Step | 853–857 ===================*/

/*=================== START: Tablet Standard Step | 858–862 ===================*/
@media (min-width: 858px) and (max-width: 862.98px){
  :root{ --services-top:280px; --services-right: 272px; }
}
/*=================== END: Tablet Standard Step | 858–862 ===================*/

/*=================== START: Tablet Standard Step | 863–867 ===================*/
@media (min-width: 863px) and (max-width: 867.98px){
  :root{ --services-top:280px; --services-right: 272px; }
}
/*=================== END: Tablet Standard Step | 863–867 ===================*/

/*=================== START: Tablet Standard Step | 868–872 ===================*/
@media (min-width: 868px) and (max-width: 872.98px){
  :root{ --services-top: 280px; --services-right: 273px; }
}
/*=================== END: Tablet Standard Step | 868–872 ===================*/

/*=================== START: Tablet Standard Step | 873–877 ===================*/
@media (min-width: 873px) and (max-width: 877.98px){
  :root{ --services-top: 290px; --services-right: 265px; }
}
/*=================== END: Tablet Standard Step | 873–877 ===================*/

/*=================== START: Tablet Standard Step | 878–882 ===================*/
@media (min-width: 878px) and (max-width: 882.98px){
  :root{ --services-top: 300px; --services-right: 265px; }
}
/*=================== END: Tablet Standard Step | 878–882 ===================*/

/*=================== START: Tablet Standard Step | 883–887 ===================*/
@media (min-width: 883px) and (max-width: 887.98px){
  :root{ --services-top: 300px; --services-right: 265px; }
}
/*=================== END: Tablet Standard Step | 883–887 ===================*/

/*=================== START: Tablet Standard Step | 888–892 ===================*/
@media (min-width: 888px) and (max-width: 892.98px){
  :root{ --services-top: 300px; --services-right: 266px; }
}
/*=================== END: Tablet Standard Step | 888–892 ===================*/

/*=================== START: Tablet Standard Step | 893–897 ===================*/
@media (min-width: 893px) and (max-width: 897.98px){
  :root{ --services-top:300px; --services-right: 266px; }
}
/*=================== END: Tablet Standard Step | 893–897 ===================*/

/*=================== START: Tablet Standard Step | 898–902 ===================*/
@media (min-width: 898px) and (max-width: 902.98px){
  :root{ --services-top: 300px; --services-right: 266px; }
}
/*=================== END: Tablet Standard Step | 898–902 ===================*/

/*=================== START: Tablet Standard Step | 903–907 ===================*/
@media (min-width: 903px) and (max-width: 907.98px){
  :root{ --services-top: 300px; --services-right: 266px; }
}
/*=================== END: Tablet Standard Step | 903–907 ===================*/

/*=================== START: Tablet Standard Step | 908–912 ===================*/
@media (min-width: 908px) and (max-width: 912.98px){
  :root{ --services-top: 300px; --services-right: 267px; }
}
/*=================== END: Tablet Standard Step | 908–912 ===================*/

/*=================== START: Tablet Standard Step | 913–917 ===================*/
@media (min-width: 913px) and (max-width: 917.98px){
  :root{ --services-top: 305px; --services-right: 260px; }
}
/*=================== END: Tablet Standard Step | 913–917 ===================*/

/*=================== START: Tablet Standard Step | 918–922 ===================*/
@media (min-width: 918px) and (max-width: 922.98px){
  :root{ --services-top: 320px; --services-right: 260px; }
}
/*=================== END: Tablet Standard Step | 918–922 ===================*/

/*=================== START: Tablet Standard Step | 923–927 ===================*/
@media (min-width: 923px) and (max-width: 927.98px){
  :root{ --services-top: 320px; --services-right: 260px; }
}
/*=================== END: Tablet Standard Step | 923–927 ===================*/

/*=================== START: Tablet Standard Step | 928–932 ===================*/
@media (min-width: 928px) and (max-width: 932.98px){
  :root{ --services-top: 320px; --services-right: 260px; }
}
/*=================== END: Tablet Standard Step | 928–932 ===================*/

/*=================== START: Tablet Standard Step | 933–937 ===================*/
@media (min-width: 933px) and (max-width: 937.98px){
  :root{ --services-top: 320px; --services-right: 260px; }
}
/*=================== END: Tablet Standard Step | 933–937 ===================*/

/*=================== START: Tablet Standard Step | 938–942 ===================*/
@media (min-width: 938px) and (max-width: 942.98px){
  :root{ --services-top: 320px; --services-right: 260px; }
}
/*=================== END: Tablet Standard Step | 938–942 ===================*/

/*=================== START: Tablet Standard Step | 943–947 ===================*/
@media (min-width: 943px) and (max-width: 947.98px){
  :root{ --services-top: 325px; --services-right: 260px; }
}
/*=================== END: Tablet Standard Step | 943–947 ===================*/

/*=================== START: Tablet Standard Step | 948–952 ===================*/
@media (min-width: 948px) and (max-width: 952.98px){
  :root{ --services-top: 325px; --services-right:259px; }
}
/*=================== END: Tablet Standard Step | 948–952 ===================*/

/*=================== START: Tablet Standard Step | 953–957 ===================*/
@media (min-width: 953px) and (max-width: 957.98px){
  :root{ --services-top: 325px; --services-right: 257px; }
}
/*=================== END: Tablet Standard Step | 953–957 ===================*/

/*=================== START: Tablet Standard Step | 958–962 ===================*/
@media (min-width: 958px) and (max-width: 962.98px){
  :root{ --services-top: 325px; --services-right: 257px; }
}
/*=================== END: Tablet Standard Step | 958–962 ===================*/

/*=================== START: Tablet Standard Step | 963–967 ===================*/
@media (min-width: 963px) and (max-width: 967.98px){
  :root{ --services-top: 325px; --services-right:257px; }
}
/*=================== END: Tablet Standard Step | 963–967 ===================*/

/*=================== START: Tablet Standard Step | 968–972 ===================*/
@media (min-width: 968px) and (max-width: 972.98px){
  :root{ --services-top:325px; --services-right: 250px; }
}
/*=================== END: Tablet Standard Step | 968–972 ===================*/

/*=================== START: Tablet Standard Step | 973–977 ===================*/
@media (min-width: 973px) and (max-width: 977.98px){
  :root{ --services-top: 325px; --services-right: 252px; }
}
/*=================== END: Tablet Standard Step | 973–977 ===================*/

/*=================== START: Tablet Standard Step | 978–982 ===================*/
@media (min-width: 978px) and (max-width: 982.98px){
  :root{ --services-top: 325px; --services-right: 255px; }
}
/*=================== END: Tablet Standard Step | 978–982 ===================*/

/*=================== START: Tablet Standard Step | 983–987 ===================*/
@media (min-width: 983px) and (max-width: 987.98px){
  :root{ --services-top: 325px; --services-right: 255px; }
}
/*=================== END: Tablet Standard Step | 983–987 ===================*/

/*=================== START: Tablet Standard Step | 988–991 ===================*/
@media (min-width: 988px) and (max-width: 991.98px){
  :root{ --services-top: 325px; --services-right: 256px; }
}
/*=================== END: Tablet Standard Step | 988–991 ===================*/
/*=================== END: Tablet Standard | 768–991 ===================*/